<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试</title>
    <style>
        /*div {*/
            /*width: 100px;*/
            /*margin: 200px auto;*/
            /*height: 100px;*/
            /*background-color: #0f0;*/
            /*transform: scale(1);*/
            /*animation:myfirst 0.8s;*/
            /*!*-moz-animation:myfirst 2s; !* Firefox *!*!*/
            /*!*-webkit-animation:myfirst 2s; !* Safari and Chrome *!*!*/
            /*!*-o-animation:myfirst 2s; !* Opera *!*!*/
        /*}*/
        /*@keyframes myfirst*/
        /*{*/
            /*!*0%   { width: 100px; height: 100px;}*!*/
            /*!*50%   { width: 300px; height: 300px;}*!*/
            /*!*100%   { width: 200px; height: 200px;}*!*/

            /*0%   { transform: scale(1);}*/
            /*50%   { transform: scale(3);}*/
            /*100%   { transform: scale(2.5);}*/
            /*!*100% { transform: scale(3); }*!*/
        /*}*/
        .box {
            width: 50px;
            height: 500px;
            background-color: #9d9d9d;
            position: relative;
        }
        .box div {
            width: 50px;
            height: 50px;
            background-color: #4cae4c;
            position: absolute;
            left: 0;
            top: 0;
        }
        #box1 {
            width: 500px;
            height: 500px;
            background-color: #f00;
            position: absolute;
            left: 70px;
            top: 8px;
        }
    </style>
</head>
<body style="">
<div class="box">
    <div></div>
</div>
<div id="box1"></div>
<script src="js/jquery-1.10.1.min.js"></script>
<script>
//    window.onload = function () {
//        var oDiv = document.getElementsByTagName('div')[0];
//        document.onclick = function () {
//            $(oDiv).css('animation','myfirst 0.5s');
//        }
//    }
    $(function () {
//        document.getElementById("box1").onwheel = function() {myFunction()};
//        function myFunction() {
////            $(window).scrollTop(100);
//            alert('触发onwheel');
//        }

        var mousewheelevt=(/Firefox/i.test(navigator.userAgent))?"DOMMouseScroll": "mousewheel";//FF doesn't recognize mousewheel as of FF3.x
        if(document.attachEvent) //if IE (and Opera depending on user setting)
            document.getElementById("box1").attachEvent("on"+mousewheelevt, function(e){alert('Mouse wheel movement detected!( IE10及以下 )')})
        else if(document.addEventListener) //WC3 browsers
            document.getElementById("box1").addEventListener(mousewheelevt, function(e){alert('Mouse wheel movement detected!')}, false)

    });
</script>
</body>
</html>